<template>
    <van-pull-refresh v-model="refreshing" @refresh="OnRefresh">
        <van-list
            v-model:loading="loading"
            :finished="finished"
            finished-text="没有更多了"
            @load="OnLoad"
        >
            <div class="item" v-for="item in list" :key="item.id">

                <p>{{ item.content }}</p>
                <p>金额：{{ item.total }}元</p>
                <p>时间：{{ item.createtime_text }}</p>
            </div>
        </van-list>
    </van-pull-refresh>

</template>

<script setup>

const { proxy } = getCurrentInstance();

const business = proxy.$business;

//下拉刷新状态
const refreshing = ref(false);
//懒加载
const loading = ref(false);
//下拉加载状态
const finished = ref(false);
//分页=》当前页
const page = ref(1);
//数据列表
const list = ref([]);

//挂载
const OnRefresh = () => {
    list.value = [];
    page.value = 1;
    refreshing.value = true;
    loading.value = true;
    finished.value = false;

    setTimeout(OnLoad, 1500);
}

const OnLoad = async () => {
    if (refreshing.value === true) {
        refreshing.value = false;
    }

    const params = { 
        busid: business.value.id,
        page: page.value
    }
    console.log(params);
    const result = await proxy.$http.post('/business/record', params);

    loading.value = false;

    if (result.code === 1) {
        let count = result.data.count;
        list.value = list.value.concat(result.data.list);

        if (list.value.length >= count) {
            finished.value = true;

            return false;
        }

        page.value  += 1;
    }else {
        finished.value = true;

        proxy.$fail(result.msg);
    }
}

</script>

<style scoped>
.item {
    background: #fff;
    width: 100%;
    text-indent: 1.5em;
    font-size: 1em;
    padding: 10px 0;
    border-bottom: 1px solid #eaeaea;
}
</style>